<template>
	<view>
		<!-- 返回 -->
		<!-- <view class="backs"> 
			<view @click="backlast()">
				<image src="../../static/back1.png"></image>
			</view>
		</view> -->
		<view class="container">
			<!-- 背景色区域 -->
			<view class="titleNview-background"
				:style="'background: url('+url()+'/wximg/bjTop1.png'+'); background-size: 100%;'">

				<!-- 商户名称 许可证号-->
				<view class="text-box">
					<view @click="backlast()">
						<image src="../../static/backs.png"></image>
					</view>
					<view>
						<view class="text-temp">商户名称：{{MerchantName}}</view>
						<view class="text-temp">许可证号：{{licence}}</view>
					</view>
				</view>

			</view>
			<!-- 待配送商户已配送商户区域 -->
			<view class="model">
				<view class="onlyOne">
					<view class="modelrt">
						<text>包裹</text>
						<text class="psnums"><text class="psnum">{{packageNumber}}</text>个</text>
					</view>
				</view>
				<text class="modeline"></text>
				<view class="onlyOne">
					<view class="modelrt">
						<text>香烟</text>
						<text class="psnums"><text class="psnum">{{cigaretteNumber}}</text>条</text>
					</view>
				</view>
				<text class="modeline"></text>
				<view class="onlyOne">
					<view class="modelrt">
						<text>已验签</text>
						<text class="psnums"><text class="psnum">{{VerifiedNubmer}}</text>条</text>
					</view>
				</view>
				<text class="modeline"></text>
				<view class="onlyOne">
					<view class="modelrt">
						<text>异常</text>
						<text class="psnums"><text class="psnum"
								style="color: #ef0000;">{{abnormalNumber}}</text>条</text>
					</view>
				</view>
				<!-- 	<view>
					<button class="pesBtn" hover-class='pesBtn-hover' @click="toFlash" type="primary" style="padding: 0 60upx;">扫码</button>
				</view> -->
			</view>

			<view class="wrapper" :style="{minHeight: heightContent+'px'}">
				<view v-for="(item,i) in contents" class="tableBox">
					<view class="tabletitle">{{AuthorizationList}}</view>
					<view class="table">
						<view class="bgName">
							<text>包裹{{i+1}}</text>
							<text>包裹编码：<text>{{item.packageCode}}</text></text>
						</view>
						<wyb-table :key="key" show-vert-border="false" header-bg-color="#fff" first-col-bg-color="#fff"
							content-bg-color="#fff" height='282px' content-ft-color="#333333" header-weight="true"
							border-color="#ffffff" ref="table" :headers="headers"
							:contents="item.deliveryPackageRowList" width="100%" :show-vert-border="vertborder"
							:loading="loading" :url-col="urlCol" @onCheck="onCheck" @onCellClick="onCellClick"
							@onButtonClick="onButtonClick" />
					</view>
				</view>
				<view v-if="contents.length==0" class="tableBox">
					<view class="tabletitle">暂无数据/货品已送到</view>
				</view>
				<!-- totalCount==contents.length&&totalCount>0&& v-if="overtAnd" -->
				<button  v-if="overtAnd" @click.stop="confirmCustom()" class="Confirm-delivery"
					hover-class='Confirm-delivery-hover' type="primary">确认配送结果</button>
				
				<!-- <button v-if="QRCodeshow"  @click.stop="generateQR()" class="Confirm-delivery" hover-class='Confirm-delivery-hover'
										  type="primary">生成二维码</button> -->

			</view>
			<!-- 查看异常图片 -->
			<popupConfirm ref="tableConfirm">
				<view class="popup-info">
					<view type="default" @click="showclose" class="close">
						<image :src="url()+'/wximg/close.png'"></image>
					</view>
					<view class="popuptitle">上传异常图片</view>
					<form class="form">
						<view class="uni-list-cell">
							<view class="uni-list-cell-left">更改状态</view>
							<view class="uni-list-cell-db">
								<picker @change="bindPickerChange" :value="index" :range="array">
									<view class="uni-input">{{array[index]}}</view>
								</picker>
							</view>
						</view>

						<view class="imgWra" v-show="specClass">
							<view class="uni-list-cell">
								<view class="uni-list-cell-left">异常内容</view>
								<view class="uni-list-cell-db">
									<picker @change="bindPickerChange2" range-key="d_name" :value="index2"
										:range="array2">
										<view class="uni-input">{{array2[index2].d_name}}</view>
									</picker>
								</view>
							</view>


							<view class="uni-list-cell">
								<view class="uni-list-cell-left">异常图片</view>
								<view class="uni-list-cell-db">
									<view @click="uploadImg" v-if="imgonshows==true" class="update">
										<image class="upImg" :src="abnormalImg" mode=""></image>
									</view>
								</view>
							</view>
							<!-- <view class="spetext">请上传异常图片</view>
							<view  @click="uploadImg" v-if="imgonshows==true" class="update">
								<image class="upImg"  :src="abnormalImg" mode=""></image>							
							</view> -->
							<!-- <view  @click="uploadImg" class="content"  v-if="imgonshows==false">
								<image class="showImg" :src="imgArr" mode="" ></image>
							</view> -->

							<textarea v-show="showtextarea" v-model="exceptionDesc" class="reviewImg" focus="true"
								maxlength="-1" placeholder="请留下您的宝贵意见!" />
						</view>

						<button @click.stop="close()" class="Confirm-delivery" hover-class='Confirm-delivery-hover'
							type="primary">确认修改</button>
					</form>
				</view>
			</popupConfirm>

			<!-- 2按钮-->
			<!-- <uni-pop ref="qxPop">
				<view class="popup-info">
					<navigator type="default" @click="close" class="close">
						<image src="../../static/font/temp/close.png"></image>
					</navigator>
					<view class="popuptitle">请选择模式</view>
					
					<view class="btnPat">
						<button type="default" class="btn" style="margin-bottom: 20upx;">扫码模式</button>
					</view>
					<view class="btnPat">
						<button type="default" class="btn" style="margin-bottom: 20upx;">查询模式</button>
					</view>
				</view>
			</uni-pop> -->
		</view>
	</view>
</template>

<script>
	// 表格
	import wybTable from '@/components/wyb-table/wyb-table.vue'
	import {
		getQRCodeTimeLimit,
		EditDeliveryTaskDetail,
		SelectDeliveryShopPackageList,
		EditDeliveryPackageRow,
		editDeliveryPackageRowType,
		dictionaryList
	} from '@/api/request.js';
	import service from '../../service.js';
	import url from '@/api/url.js';
	let user = service.getUsers().user;
	export default {
		components: {
			// 表格
			wybTable
		},
		data() {
			return {
				// 下拉列表
				url: url,
				array: ['已验', '异常'],
				array2: [],
				index: 0,
				index2: 0,
				isChoseImg: false, //是否上传图片
				specClass: false,
				showtextarea: false,
				totalCount: 0,
				overtAnd: false,
				QRCodeshow: false,
				abnormalImg: url() + '/wximg/add2.png',
				packageNumber: 0, //包裹个数
				cigaretteNumber: 0, //香烟个数
				VerifiedNubmer: 0, //验签个数
				abnormalNumber: 0, //异常个数
				reqImgObject: null,
				exceptionDesc: "",
				timeObject: null,
				// 上传图片
				imgArr: [],
				imgonshows: true,
				//获取高度
				heightContent: '',
				// 商户名称
				MerchantName: '吉A581k2',
				// 许可证号
				licence: '140602402769',
				// 验签清单
				AuthorizationList: '验签清单',
				// 包裹编号
				packageCode: '2020041532568',
				//表格
				key: 0,
				headers2: [],
				contents2: [],
				loading: true,
				vertborder: false, //金融竖向条,但是不能去除头部
				// 表格数据
				headers: [{
					label: '品名',
					key: 'commodityName',
					width: 220
				}, {
					label: '总数',
					key: 'numtext',
					width: 130
				}, {
					label: '状态',
					key: 'commodityStatusName',
					width: 130
				}, {
					label: '操作',
					key: 'look',
					width: 160
				}],
				contents: [],
				urlCol: [{
						type: 'route',
						key: '1'
					}, {
						type: 'http',
						key: 'url'
					},
					{
						type: 'button',
						key: 'look'
					}
				]
			};
		},
		onLoad() {
			user = service.getUsers().user;
			/* 	this.name=user.customerShop.shopName; */
			this.MerchantName = user.customerShop.shopName;
			// 许可证号
			this.licence = user.customerShop.licenseCode;
			/* 		this.shopName=user.customerShop.shopName; */
			this.inItDictionary();
		},
		onReady() {
			let that = this
			uni.getSystemInfo({
				success: (res) => { // 需要使用箭头函数，swiper 高度才能设置成功
					// res - 各种参数
					let info = uni.createSelectorQuery().select(".wrapper"); // 获取某个元素
					info.boundingClientRect(function(data) { //data - 各种参数
						let view = res.windowHeight - data.top - 40
						that.heightContent = view
					}).exec()
				}
			});

		},
		onShow(e) {
			if (this.isChoseImg) { //如果是上传图片会跳  则不刷新数据
				return;
			}
			this.cigaretteNumber = 0;
			this.VerifiedNubmer = 0;
			this.abnormalNumber = 0;
			this.QRCodeshow = false;
			this.overtAnd = false;
			this.exceptionDesc = "";
			this.init();
		},
		methods: {
			backlast() {
				uni.switchTab({
					// url: '/pages/merchantsSIn/SignedIn'
					url: '/pages/index/index'
				})
			},
			confirmCustom() {
				//anchor.wos 新需求，先扫码二维码 再确认配送结果
				wx.scanCode({
				  onlyFromCamera: true,
				  success (res) {
					this.editInIt(res.result);
				  }
				})
				
			},
			inItDictionary() {
				//user.customerShop.id
				let param = {
					d_type: "errerType"
				}
				dictionaryList(param).then(res => {
					if (res.code == 200) {
						let _this = this;
						res.map.data.forEach(function(item) {
							_this.array2.push(item);
						})

					} else {
						uni.showModal({
							title: '警告',
							content: 'code不符 请联系管理员',
							showCancel: false
						})
					}
				}).catch(err => {
					uni.showModal({
						title: '警告',
						content: '失败',
						showCancel: false
					})
				})
			},
			// 获取下拉列表展示上传图片
			bindPickerChange: function(e) {

				this.index = e.target.value

				if (this.index == 1) {
					this.specClass = true;
				} else {
					this.specClass = false;
				}
			},
			bindPickerChange2: function(e) {

				this.index2 = e.target.value

				if (this.array2[this.index2].d_name == "其它") {
					this.showtextarea = true;
				} else {
					this.showtextarea = false;
				}
			},
			// 上传图片
			uploadImg() {
				let that = this
				this.isChoseImg = true;
				wx.chooseImage({
					count: 1,
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: function(res) {
						that.abnormalImg = res.tempFilePaths;
						// 上传示例
						let imageSrc = res.tempFilePaths[0];
						// this.open()
						uni.uploadFile({
							url: url() + '/app/file/upload',
							filePath: imageSrc,
							fileType: 'image',
							name: 'file',
							success: (res) => {
								if (res.statusCode != 200) {
									that.wait(1000).then(() => { //延迟 写入缓存 处理苹果 上传图片刷新
										that.isChoseImg = false;
									})
									uni.showToast({
										title: '上传失败 图片大小或格式错误。',
										icon: 'success',
										duration: 1000
									})
									that.abnormalImg = url() + '/wximg/add2.png';
									return;
								}
								that.reqImgObject = JSON.parse(res.data)
								that.wait(1000).then(() => { //延迟 写入缓存 处理苹果 上传图片刷新
									that.isChoseImg = false;
								})
								uni.showToast({
									title: '上传成功',
									icon: 'success',
									duration: 1000
								})
							},
							fail: (err) => {
								that.wait(1000).then(() => { //延迟 写入缓存 处理苹果 上传图片刷新
									that.isChoseImg = false;
								})
								uni.showToast({
									title: "失败",
									icon: 'err',
									duration: 1000
								})
								console.log('uploadImage fail', err);
							}
						});

					},
					fail: function(res) {
						that.wait(1000).then(() => { //延迟 写入缓存 处理苹果 上传图片刷新
							that.isChoseImg = false;
						})

						console.log(res)
					}
				})
			},
			//表格
			onCellClick(e) {
				/* console.log("列表点击")
				console.log(e) */
			},
			onCheck(e) {
				/* console.log("多选框点击")
				console.log(e) */

			},

			// 关闭弹窗
			close() {

				if (this.index != 0 && this.reqImgObject == null) {
					uni.showToast({
						title: '请上传图片!',
						icon: 'none'
					});
					return;
				}

				let tableConfirm = this.$refs.tableConfirm
				tableConfirm.onTap()
				let thsi = this;
				this.contents.forEach(function(item) {
					item.deliveryPackageRowList.forEach(function(items) {
						if (thsi.timeObject.id == items.id) {
							if (thsi.index == 1) {
								items.listState = true;
								items.listColor = [{
									"element": 0,
									"color": "#ef0000"
								}, {
									"element": 1,
									"color": "#ef0000"
								}, {
									"element": 2,
									"color": "#ef0000"
								}, {
									"element": 3,
									"color": "#ef0000"
								}]
								items.commodityStatusName = "异常"
								items.look = '更改';
								if (thsi.reqImgObject != null) {
									items.qePrictureUrl = thsi.reqImgObject[0].uploadAddress
									items.qePrictureUrlId = thsi.reqImgObject[0].id
								}
								if (items.commodityStatus == 2) {
									if (parseInt(items.commodityType) == 1) { //判断类型
										thsi.abnormalNumber = thsi.abnormalNumber + parseInt(items.num)
										thsi.VerifiedNubmer = thsi.VerifiedNubmer - parseInt(items.num)
									} else {
										thsi.abnormalNumber = thsi.abnormalNumber + (parseInt(items.num) *
											10)
										thsi.VerifiedNubmer = thsi.VerifiedNubmer - (parseInt(items.num) *
											10)
									}

								}
								items.exceptionCode = thsi.array2[thsi.index2].id;
								if (thsi.array2[thsi.index2].d_name == "其它") {
									items.exceptionDesc = thsi.exceptionDesc;
								}

								items.commodityStatus = 3;
							} else {


								if (items.commodityStatus == 3) {
									if (parseInt(items.commodityType) == 1) { //判断类型

										thsi.abnormalNumber = thsi.abnormalNumber - parseInt(items.num)
										thsi.VerifiedNubmer = thsi.VerifiedNubmer + parseInt(items.num)
									} else {
										thsi.abnormalNumber = thsi.abnormalNumber - (parseInt(items.num) *
											10)
										thsi.VerifiedNubmer = thsi.VerifiedNubmer + (parseInt(items.num) *
											10)
									}


								}
								items.listState = false;
								items.commodityStatusName = "已验"
								items.look = '异常';
								items.commodityStatus = 2;
							}
						}
					})
				})
			},
			showclose() {
				let tableConfirm = this.$refs.tableConfirm
				tableConfirm.onTap()
			},
			// 打开弹窗
			onButtonClick(e) {
				if (!this.overtAnd) {
					if (e.lineData.deliveryStatusType == 3 || e.lineData.deliveryStatusType == 0) {
						uni.showToast({
							title: '未开始配送,不可操作!',
							icon: 'none'
						});
						return;
					}
					uni.showToast({
						title: '已验签不可更改!',
						icon: 'none'
					});
					return;
				}
				this.reqImgObject = null;
				this.exceptionDesc = "";
				this.showtextarea = false;
				this.index2 = 0;
				this.timeObject = e.lineData;

				if (e.lineData.commodityStatus == 3) {
					this.index = 1
					let tableConfirm = this.$refs.tableConfirm
					tableConfirm.open()
					this.abnormalImg = e.lineData.qePrictureUrl
					this.specClass = true;

					for (let is = 0; this.array2.length > is; is++) {
						if (this.array2[is].id == e.lineData.exceptionCode) {
							this.index2 = is;
							if (this.array2[is].d_name == "其它") {
								this.showtextarea = true;
								this.exceptionDesc = e.lineData.exceptionDesc
								break;
							} else {
								this.showtextarea = false;
							}
						}
					}

				} else {
					let tableConfirm = this.$refs.tableConfirm
					tableConfirm.open()
					this.index = 0
					this.specClass = false;
					this.abnormalImg = url() + '/wximg/add2.png';
				}

			},
			wait(time) {
				return new Promise(resolve => {
					setTimeout(() => {
						resolve()
					}, time)
				})
			},

			init() { //初始化列表
				let param = {
					shopId: user.customerShop.id,
				};
				let thsi = this;
				let _this = this;
				this.contents = [];
				SelectDeliveryShopPackageList(param).then(res => {
					if (res.code == 200) {
						this.packageNumber = res.map.data.length; //渲染包裹个数
						res.map.data.forEach(function(item) {

							if (item.deliveryStatus == 1) {
								_this.QRCodeshow = true;
							} else if (item.staff_sig == 0 && item.deliveryStatus == 2) {
								_this.overtAnd = true;
							}
							item.deliveryPackageRowList.forEach(function(items) {
								if (item.deliveryStatus == 3 || item.deliveryStatus == 0) {
									items.deliveryStatusType = item.deliveryStatus;
								}

								if (parseInt(items.commodityType) == 1) { //判断类型
									items.numtext = items.num + "条"
									_this.cigaretteNumber = _this.cigaretteNumber + parseInt(items
										.num)
								} else {
									items.numtext = items.num + "箱"
									_this.cigaretteNumber = _this.cigaretteNumber + (parseInt(items
										.num) * 10)
								}
								if (parseInt(items.commodityStatus) == 3) {
									if (parseInt(items.commodityType) == 1) { //判断类型
										_this.abnormalNumber = _this.abnormalNumber + parseInt(
											items.num)
									} else {
										_this.abnormalNumber = _this.abnormalNumber + (parseInt(
											items.num) * 10)
									}

									items.listState = true;
									items.listColor = [{
										"element": 0,
										"color": "#ef0000"
									}, {
										"element": 1,
										"color": "#ef0000"
									}, {
										"element": 2,
										"color": "#ef0000"
									}, {
										"element": 3,
										"color": "#ef0000"
									}]
									items.commodityStatusName = "异常"

									if (item.deliveryStatus != 1) {
										items.look = '更改';
									}

								} else if (parseInt(items.commodityStatus) == 2) {
									if (parseInt(items.commodityType) == 1) { //判断类型
										_this.VerifiedNubmer = _this.VerifiedNubmer + parseInt(
											items.num)
									} else {
										_this.VerifiedNubmer = _this.VerifiedNubmer + (parseInt(
											items.num) * 10)
									}
									items.commodityStatusName = "已验"

									if (item.deliveryStatus != 1) {
										items.look = '异常';
									}
								} else if (parseInt(items.commodityStatus) == 1) {
									/* if(parseInt(items.commodityType)==1){//判断类型
										_this.VerifiedNubmer=_this.VerifiedNubmer+parseInt(items.num)
									}else{
										_this.VerifiedNubmer=_this.VerifiedNubmer+(parseInt(items.num)*10)
									} */
									items.commodityStatusName = "待验"

									/* if(item.deliveryStatus!=1){
										items.look='异常';
									} */
								}
							})
							_this.contents.push(item);
						});
						this.headers2 = this.headers.slice()
						this.contents2 = this.contents.slice()
						this.loading = false

					} else {
						uni.showModal({
							title: '警告',
							content: 'code不符 请联系管理员',
							showCancel: false
						})
					}
				}).catch(err => {
					uni.showModal({
						title: '警告',
						content: '查询失败',
						showCancel: false
					})
				})

			},
			wait(time) {
				return new Promise(resolve => {
					setTimeout(() => {
						resolve()
					}, time)
				})
			},
			editInIt(orCode) {

				let param = {
					detailId: this.contents[0].detailId,
					commodityStatus: 2,
					ifStatus: 1,
					clerkId: user.id,
					cherkName: user.clerkName,
					remark:orCode //anchor.wos
				}
				let contentslength = 0;
				let deliveryPackageRowListlength = 0;
				let _this = this;
				EditDeliveryPackageRow(param).then(res => {
					if (res.code == 200) {
						_this.contents.forEach(function(item) {
							contentslength = _this.contents.indexOf(item) + 1
							item.deliveryPackageRowList.forEach(function(items) {
								deliveryPackageRowListlength = item.deliveryPackageRowList.indexOf(
									items) + 1

								if (items.commodityStatus == 3) {
									let paramData = {};
									paramData.commodityStatus = items.commodityStatus;
									paramData.qePrictureUrl = items.qePrictureUrlId;
									paramData.exceptionCode = items.exceptionCode;
									paramData.id = items.id;
									if (items.exceptionDesc != null && items.exceptionDesc != "") {
										paramData.exceptionDesc = items.exceptionDesc;
									}
									editDeliveryPackageRowType(paramData).then(res => {
										if (res.code == 200) {

										} else {
											uni.showModal({
												title: '警告',
												content: 'code不符 请联系管理员',
												showCancel: false
											})
										}
									}).catch(err => {
										console.log(err)
										uni.showToast({
											title: '修改失败',
											icon: 'none'
										});
									})

								}
								if (contentslength == _this.contents.length &&
									deliveryPackageRowListlength == item.deliveryPackageRowList
									.length) {

									let data = {
										id: _this.contents[0].detailId,
										staff_sig: 1
									}
									EditDeliveryTaskDetail(data).then(res => {
										if (res.code == 200) {
											let e = {
												id: user.customerShop.id,
												lineData: {
													evaluateCompany: 0,
													evaluateUser: 0,
													id: _this.contents[0].detailId
												},
												userid: user.id,
												type: 2
											};

											uni.redirectTo({
												url: '/pages/merchantsSIn/signedInDetail?data=' +
													encodeURIComponent(JSON
														.stringify(e)),
											})
										} else {
											uni.showModal({
												title: '警告',
												content: 'code不符 请联系管理员',
												showCancel: false
											})
										}
									}).catch(err => {
										console.log(err)
										uni.showToast({
											title: '修改失败',
											icon: 'none'
										});
									})


								}
							})

						})

					} else {
						uni.showModal({
							title: '警告',
							content: 'code不符 请联系管理员',
							showCancel: false
						})
					}
				}).catch(err => {

					console.log(err)
					uni.showToast({
						title: '修改失败',
						icon: 'none'
					});
				})

			},
			generateQR() {
				getQRCodeTimeLimit().then(res => {
					if (res.code == 200) {
						let e = {
							id: user.customerShop.id,
							lineData: {
								evaluateCompany: 0,
								evaluateUser: 0,
								id: this.contents[0].detailId
							},
							userid: user.id,
							type: 2,
							time: res.map.data
						};
						uni.redirectTo({
							url: '/pages/merchantsCord/merchantsCord?data=' + encodeURIComponent(JSON
								.stringify(e)),
						})
					} else {
						uni.showModal({
							title: '警告',
							content: 'code不符 请联系管理员',
							showCancel: false
						})
					}
				}).catch(err => {
					uni.showModal({
						title: '警告',
						content: '失败',
						showCancel: false
					})
				})

			}
		}

	}
</script>

<style scoped>
	.backs {
		position: absolute;
		z-index: 11111;
		top: 85upx;
		left: 30upx;
		display: flex;
		color: #000;
		line-height: 30upx;
		align-items: center;
		display: inline-block;
	}

	.backs image {
		width: 45upx;
		height: 45upx;
		margin-right: 14upx;
	}

	.titleNview-background {
		width: 100%;
		height: 418upx;
		-webkit-transition: .4s;
		transition: .4s;
		background-size: 100% 100%;
		position: relative;
	}

	.wrapper {
		position: relative;
		width: 91%;
		margin: 0 auto;
		z-index: 2;
		border-top-left-radius: 27upx;
		border-top-right-radius: 27upx;
		background-color: #fff;
		padding-bottom: 40px;
	}

	/*授权门店 人员*/
	.text-box {
		position: absolute;
		color: #fff;
		bottom: 150upx;
		left: 5%;
		width: 91%;
		z-index: 2;
		display: flex;
		flex-direction: row;
	}

	.text-box image {
		width: 80upx;
		height: 80upx;
		margin-right: 20upx;
	}

	.text-temp {
		line-height: 50upx;
		font-size: 32upx;
	}

	.pesBtn {
		border-radius: 200upx;
		background-color: #ffc562;
		font-size: 28upx;
		color: #fff;
	}

	/* 待配送 已配送商户 */
	.model {
		width: 87%;
		margin: 0 auto;
		margin-top: -129upx;
		margin-bottom: 44upx;
		padding: 35upx 2%;
		border-radius: 27upx;
		background-color: #fff;
		z-index: 2;
		box-shadow: 0 5px 5px rgba(227, 227, 227, .5);
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.onlyOne {
		display: flex;
		align-items: center;
	}

	.modeline {
		width: 1px;
		height: 70upx;
		background-color: #eeeeee;
	}

	.modelrt {
		flex: 1;
		display: flex;
		flex-direction: column;
		color: #888888;
		white-space: nowrap;
		font-size: 21.84upx;
		text-align: center;
	}

	.psnums {
		color: #000;
		font-size: 28.08upx;
		margin-top: 5upx;
	}

	.psnum {
		color: #f69c3c;
		font-size: 38upx;
		font-weight: bold;
		margin-right: 10upx;
	}

	.pesBtn {
		border-radius: 200upx;
		background-color: #ffc562;
		font-size: 28upx;
		color: #fff;
	}

	/* 表格 */
	.tableBox {
		width: 100%;
		padding-bottom: 20upx;

	}

	.tabletitle {
		border-top-left-radius: 27upx;
		border-top-right-radius: 27upx;
		background-color: #007457;
		height: 98upx;
		width: 100%;
		text-align: center;
		line-height: 98upx;
		color: #fff;
		font-size: 32upx;
	}

	.table {
		width: 96%;
		margin: 0 auto;
		/* 下方的灰色分割线 */
		border-bottom: solid 14upx #eee;
		padding-bottom: 40upx;
		margin-bottom: 40upx;
	}

	/*包裹ID及包裹编号*/
	.bgName {
		padding: 20upx 0;
		line-height: 40upx;
		display: flex;
		justify-content: space-between;
		word-wrap: break-word;
		white-space: normal;
		word-break: break-all;
		border-bottom: solid 1px #eee;
	}

	/* 确认配送结果 btn */
	.Confirm-delivery {
		background-color: #ffc562;
	}

	.Confirm-delivery-hover {
		background-color: #db760d;
	}

	.Confirm-delivery,
	.Confirm-delivery-hover {
		border-radius: 200upx;
		margin: 0upx auto 0;
		box-shadow: 0 2px 5px #e3e3e3;
	}

	.pesBtn::after,
	.Confirm-delivery::after {
		border: none;
	}

	/* 是否确认取消弹窗 */
	.popup-info {
		position: fixed;
		min-width: 80%;
		max-width: 80%;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		font-size: 30upx;
		border-radius: 27upx;
		background-color: #fff;
		z-index: 9999;
	}

	.popuptitle {
		border-top-left-radius: 27upx;
		border-top-right-radius: 27upx;
		background-color: #007457;
		height: 98upx;
		width: 100%;
		text-align: center;
		line-height: 98upx;
		color: #fff;
		font-size: 36upx;
		letter-spacing: 2px;
	}

	/* 表单 */
	.form {
		width: 90%;
		position: relative;
		margin: 40upx auto;
		display: block;
	}

	.uni-list-cell {
		line-height: 90upx;
	}

	.uni-list-cell-left {
		color: #999;
	}

	.uni-list-cell::after {
		left: 0;
	}

	.uni-list-cell-db image {
		width: 30upx;
		height: 30upx;
		padding: 0 15upx;
		vertical-align: middle;
		display: inline-block;
	}

	.spetext {
		text-align: center;
		line-height: 50upx;
		color: #007457;
	}

	.close {
		position: absolute;
		top: -75upx;
		left: 10upx;
	}

	.close image {
		width: 37upx;
		height: 37upx;
	}

	.imgWra {
		width: 100%;
		margin: 0 auto 80upx;
	}

	.up-check {
		width: 500upx;
		height: 500upx;
	}

	/* 弹窗按钮 */
	.btnPat {
		width: 100%;
		display: flex;
		flex: 1;
		flex-direction: row;
	}

	.btn {
		width: 90%;
		background-color: #ffc562;
		border-radius: 200upx;
		margin: 40upx auto;
		box-shadow: 0 2px 5px #e3e3e3;
		color: #fff;
	}

	.btn::after {
		border: none;
	}

	/* 上传图片 */
	.update {
		border: solid 1px #e6e7e8;
		background-color: #fff;
		border-radius: 10upx;
		width: 202upx;
		height: 202upx;
		margin: 10px 0;
		display: flex;
		flex: 1;
		/*设置容器内部容器的排列方向*/
		flex-direction: column;
		align-items: center;
		justify-content: center
	}

	.update .upImg {
		width: 80%;
		height: 80%;
		margin: 0 auto;
		padding: 0;
	}

	.reviewImg {
		width: 94%;
		height: 120rpx;
		padding: 10px 3%;
		margin: 0 auto;
		border-bottom: solid 1px #e6e7e8;
		color: #888;
		font-size: 14px;
	}

	.content {
		background-color: #fff;
		border: solid 1px #999;
		border-radius: 10upx;
		width: 400upx;
		height: 400upx;
		margin: 0 auto;
		display: flex;
		align-items: center;
		align-content: center;
	}

	.content .showImg {
		width: 80%;
		height: 80%;
		margin: 0 auto;
	}
</style>
